import request from '../../utils/request.js'

let startY = 0//手指起始坐标
let moveY = 0//手指移动坐标
let moveDisatance  = 0//计算手指移动距离

// pages/personal/personal.js

Page({

  /**
   * 页面的初始数据
   */
  data: {
    coverTransform: 'translateY(0)',
    //用户登录成功后的数据
    userInfo: {},
    //判断是否为登录状态
    on_login: true,
    recentPlayList: [],//用户播放记录
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    let userInfo = wx.getStorageSync('userInfo')
    if(userInfo){
      //更新状态
      this.setData({
        //转为JSON格式的对象
        userInfo: JSON.parse(userInfo)
      })
    }
    console.log(this.data.userInfo)
    //转为JSON格式的字符串判断是否为"{}"，从而判断用户是否为登录状态！
    if(JSON.stringify(this.data.userInfo) === "{}"){
      this.setData({
        on_login: false
      })
    }

    //获取用户播放记录
    if(this.data.on_login){
      this.getRecentPlayList()
    }
    
  },

   //获取用户播放记录功能函数
    getUserRecentPlayList(userId) {
    let recentPlayList = this.data.recentPlayList
    //由于没有key，手动配置key
    let index = 0
    let a = recentPlayList.splice(0, 10).map(item => {
      item.id = index ++
      return item
    })
    this.setData({
      recentPlayList: a
    })
  },

  //event时间捕捉用户手指数量，以第一根手指为标准触发
  handleTouchStart(event) {
    //清除过度效果
    this.setData({
      coveTransition: ''
    })
    startY = event.touches[0].clientY//获取手指的起始坐标
  },

  handleTouchMove(event) {
    moveY = event.touches[0].clientY
    moveDisatance = moveY - startY
    //判断条件移动
    if(moveDisatance <=0 ) {
      return
    }
    
    if(moveDisatance >= 80) {
      moveDisatance = 80
    }

    //根据手指移动距离动态跟新
    this.setData({
      coverTransform: `translateY(${moveDisatance}rpx)`
    })
  },
  //手指松开后回弹效果实现，为什么回弹后moveDisatance会自动归零目前不清楚
  handleTouchEnd() {
    this.setData({
      coverTransform: 'translateY(0)',
      coveTransition: 'transform 1s linear'
    })
  },

  toLogin() {
    if(!this.data.on_login){
    wx.navigateTo({
      url: '/pages/login/login'
    })
    }

   
  },
  
   upLoad() {
   let that = this//由于小程序不能很好的使用箭头函数，所以要把this赋值给that一份以方便包裹的函数能获取实例对象
  if(this.data.on_login){
    wx.showModal({
      title:"确定退出吗？",
      async success (res) {
       if(res.confirm){
          //退出登录
            await request("/logout")
            //清空缓存中的数据
            wx.removeStorageSync('userInfo')
            wx.removeStorageSync('user_login')
            //这里由于不是在上一层中所以要先在前面把this赋值给that来替换
            that.setData({
              userInfo: {},
              recentPlayList: []
            })
            that.setData({
              on_login: false
            })
            wx.showToast({
              title: '退出成功！',
            })
            console.log('退出成功')
        }else if (res.cancel) {
            return
        }
      } 
    })
  }else{
    wx.showToast({
      title: '您还未登录！',
    })
  }
  },

  getRecentPlayList() {
    // 模拟数据
  let a = [
    {
      picUrl:"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg5.iqiyipic.com%2Fimage%2Fppopen%2Fppopen_5e8982560adcdc2934c61339_0.jpg&amp;refer=http%3A%2F%2Fimg5.iqiyipic.com&amp;app=2002&amp;size=f9999,10000&amp;q=a80&amp;n=0&amp;g=0n&amp;fmt=jpeg?sec=1631279071&amp;t=40a43a38416aee6adef4c6bd8edaf602"
    },
    {
      picUrl:"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp1.music.126.net%2FJ9rUFQZhI530kYFj167auA%3D%3D%2F109951163755213533.jpg&amp;refer=http%3A%2F%2Fp1.music.126.net&amp;app=2002&amp;size=f9999,10000&amp;q=a80&amp;n=0&amp;g=0n&amp;fmt=jpeg?sec=1631279006&amp;t=8be6b050608fd418be603b48727091f9"
    },
    {
      picUrl:"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp4.music.126.net%2Fk5IeL8ko8cx0QsumpecTrA%3D%3D%2F109951163076339407.jpg&amp;refer=http%3A%2F%2Fp4.music.126.net&amp;app=2002&amp;size=f9999,10000&amp;q=a80&amp;n=0&amp;g=0n&amp;fmt=jpeg?sec=1631279042&amp;t=6b01d6a06c063bc8828c3b2ebfb61d25"
    },
    {
      picUrl:"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp2.music.126.net%2F28bo2xtJsmQI9XA-N__t1w%3D%3D%2F109951164341619904.jpg&amp;refer=http%3A%2F%2Fp2.music.126.net&amp;app=2002&amp;size=f9999,10000&amp;q=a80&amp;n=0&amp;g=0n&amp;fmt=jpeg?sec=1631279507&amp;t=2545e661ca8b097c72ef29d96a125e30"
    },
    {
      picUrl:"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fi2.hdslb.com%2Fbfs%2Farchive%2F8afd0aae38286d207cb44fc9500d56d2ee5a498e.jpg&amp;refer=http%3A%2F%2Fi2.hdslb.com&amp;app=2002&amp;size=f9999,10000&amp;q=a80&amp;n=0&amp;g=0n&amp;fmt=jpeg?sec=1631279565&amp;t=00cd2e1f72e8753e0d0f246987bae333"
    },
    {
      picUrl:"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp3.music.126.net%2FbWKYth2dCvvg_xJrP9SqFw%3D%3D%2F19211766672264784.jpg&amp;refer=http%3A%2F%2Fp3.music.126.net&amp;app=2002&amp;size=f9999,10000&amp;q=a80&amp;n=0&amp;g=0n&amp;fmt=jpeg?sec=1631279612&amp;t=ffb7a612e885c960f3b11718f2234e1e"
    }
  ]
  this.setData({
    recentPlayList: a
  })
  },
 

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})